function Arrow(x, y, color, angle) {
  this.x = x || 0;
  this.y = y || 0;
  this.color = color || "red";
  this.angle = angle || 0;
}

Arrow.prototype = {
  stroke: function (cxt) {
    cxt.save();
    cxt.translate(this.x, this.y);
    cxt.rotate(this.angle); // 平移和旋转是需要放在画路径之前
    cxt.strokeStyle=this.color; 
    cxt.beginPath();
    cxt.moveTo(-20, -10);
    cxt.lineTo(0, -10);
    cxt.lineTo(0, -20);
    cxt.lineTo(20, 0);
    cxt.lineTo(0, 20);
    cxt.lineTo(0, 10);
    cxt.lineTo(-20, 10);
    cxt.closePath();
    cxt.stroke();
    cxt.restore();
  },

  fill:function(cxt){
    cxt.save();
    cxt.translate(this.x, this.y);
    cxt.rotate(this.angle); // 平移和旋转是需要放在画路径之前
    cxt.beginPath();
    cxt.moveTo(-20, -10);
    cxt.lineTo(0, -10);
    cxt.lineTo(0, -20);
    cxt.lineTo(20, 0);
    cxt.lineTo(0, 20);
    cxt.lineTo(0, 10);
    cxt.lineTo(-20, 10);
    cxt.closePath();
    cxt.fillStyle=this.color;
    cxt.fill();
    cxt.restore();
  }
};
